<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="html5Day04.css">
<title>拖拽演示</title>
</head>
<body>

	<div id="main">
		<!-- 拖拽区域 -->
		<div>
			<h3>拖拽区域</h3>
			<div class="divArea">
				<img alt="" src="cat2.jpg" id="img1">
			</div>
			
			<div class="mesArea">
				<div id="dragstart">ondragstart：</div>
				<div id="drag">ondrag：</div>
				<div id="dragend">ondragend：</div>
			</div>
		</div>
	
		<!-- 投放区域 -->
		<div>
			<h3>目标区域</h3>
			<div class="divArea" id="targetDiv" draggable="true">	
			</div>
			
			<div class="mesArea">
				<div id="dragenter">ondragenter：</div>
				<div id="dragover">ondragover：</div>
				<div id="dragleave">ondragleave：</div>
				<div id="drop">ondrop：</div>
			</div>
		</div>
	</div>

<script type="text/javascript" src="html5Day04.js"></script>
</body>
</html>